<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>SysUser编辑</title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link th:href="@{/css/common/bootstrap.min.css}" th:rel="stylesheet">
    <link th:href="@{/css/common/font-awesome.css}" th:rel="stylesheet">
    <link th:href="@{/css/common/animate.css}" th:rel="stylesheet">
    <link th:href="@{/css/common/style.css}" th:rel="stylesheet">
    <link th:href="@{/css/plugins/treeSelect/treeSelectStyle.css}" th:rel="stylesheet">
    <link th:href="@{/css/plugins/treeSelect/metroStyle/metroStyle.css }" th:rel="stylesheet">
    <link th:href="@{/css/fileUpload/imageUpload.css}" th:rel="stylesheet">

</head>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>SysUser编辑</h5>
                </div>
                <div class="ibox-content">
                    <form class="form-horizontal m-t" id="frm" method="post" action="">
                        <input type="hidden" id="id" name="id">

                            <div class="form-group">
                                <label class="col-sm-3 control-label">用户名：</label>
                                <div class="col-sm-8">
                                    <input id="username" name="username" class="form-control" type="text">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">真实姓名：</label>
                                <div class="col-sm-8">
                                    <input id="realname" name="realname" class="form-control" type="text">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">密码：</label>
                                <div class="col-sm-8">
                                    <input id="password" name="password" class="form-control" type="text">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">盐：</label>
                                <div class="col-sm-8">
                                    <input id="salt" name="salt" class="form-control" type="text">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">头像：</label>
                                <div class="col-sm-8">
                                    <input id="avaotr" name="avaotr" class="form-control" type="text">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">生日：</label>
                                <div class="col-sm-8">
                                    <input id="birthday" name="birthday" class="form-control" type="text">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">性别：</label>
                                <div class="col-sm-8">
                                    <input id="sex" name="sex" class="form-control" type="text">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">邮箱：</label>
                                <div class="col-sm-8">
                                    <input id="email" name="email" class="form-control" type="text">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">电话：</label>
                                <div class="col-sm-8">
                                    <input id="phone" name="phone" class="form-control" type="text">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">地址：</label>
                                <div class="col-sm-8">
                                    <input id="address" name="address" class="form-control" type="text">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">状态（1启用 0不启用）：</label>
                                <div class="col-sm-8">
                                    <input id="status" name="status" class="form-control" type="text">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">删除标志：</label>
                                <div class="col-sm-8">
                                    <input id="delFlag" name="delFlag" class="form-control" type="text">
                                </div>
                            </div>



                        <div class="form-group">
                            <div class="col-sm-8 col-sm-offset-3">
                                <button class="btn btn-primary" type="reset" onclick="">重置</button>
                                <button class="btn btn-primary" type="submit">提交</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

</div>


<!-- 全局js -->
<script th:src="@{/js/common/jquery.min.js}"></script>
<script th:src="@{/js/common/bootstrap.min.js}"></script>

<!-- 自定义js -->
<script th:src="@{/js/common/content.js}"></script>


<!-- 树形下拉框    -->
<script th:src="@{/js/plugins/treeSelect/treeSelect.2.0.js}"></script>
<script th:src="@{/js/plugins/zTree/jquery.ztree.all.js}"></script>
<!-- jQuery Validation plugin javascript-->
<script th:src="@{/js/plugins/validate/jquery.validate.min.js}"></script>
<script th:src="@{/js/plugins/validate/messages_zh.min.js}"></script>
<script th:src="@{/js/plugins/layer/layer.min.js}"></script>
<script th:src="@{/js/plugins/layer/laydate/laydate.js}"></script>

<script type="text/javascript">
    $(document).ready(function () {
        $("#frm").validate({
            // debug:true  如果这个参数为true，那么表单不会提交，只进行检查，调试时十分方便。
            // ignore:".ignore"  对某些元素不进行验证
            //自定义规则,key:value的形式,key是要验证的元素,value可以是字符串或对象
            rules: {
                  id:
                          {
                              required: true
                          },
                  username:
                          {
                              required: true
                          },
                  realname:
                          {
                              required: true
                          },
                  password:
                          {
                              required: true
                          },
                  salt:
                          {
                              required: true
                          },
                  avaotr:
                          {
                              required: true
                          },
                  birthday:
                          {
                              required: true
                          },
                  sex:
                          {
                              required: true
                          },
                  email:
                          {
                              required: true
                          },
                  phone:
                          {
                              required: true
                          },
                  address:
                          {
                              required: true
                          },
                  status:
                          {
                              required: true
                          },
                  delFlag:
                          {
                              required: true
                          },
            },
            //自定义的提示信息key:value的形式key是要验证的元素,值是字符串或函数
            //message当违反对应的规则时，所出现的提示信息
            messages: {
                        id:
                            {
                                required: "请输入"
                            },
                        username:
                            {
                                required: "请输入"
                            },
                        realname:
                            {
                                required: "请输入"
                            },
                        password:
                            {
                                required: "请输入"
                            },
                        salt:
                            {
                                required: "请输入"
                            },
                        avaotr:
                            {
                                required: "请输入"
                            },
                        birthday:
                            {
                                required: "请输入"
                            },
                        sex:
                            {
                                required: "请输入"
                            },
                        email:
                            {
                                required: "请输入"
                            },
                        phone:
                            {
                                required: "请输入"
                            },
                        address:
                            {
                                required: "请输入"
                            },
                        status:
                            {
                                required: "请输入"
                            },
                        delFlag:
                            {
                                required: "请输入"
                            },
            },
            //使用其它方式代替传统的表单提交方式
            submitHandler: function (form) {
                var object = new Object;
                object.id =  $("#id").val();
                object.username =  $("#username").val();
                object.realname =  $("#realname").val();
                object.password =  $("#password").val();
                object.salt =  $("#salt").val();
                object.avaotr =  $("#avaotr").val();
                object.birthday =  $("#birthday").val();
                object.sex =  $("#sex").val();
                object.email =  $("#email").val();
                object.phone =  $("#phone").val();
                object.address =  $("#address").val();
                object.status =  $("#status").val();
                object.delFlag =  $("#delFlag").val();
                //使用ajax提交
                $.ajax({
                    type: "POST",
                    dataType: "json",
                    contentType:'application/json;charset=utf-8',
                    //设置异步
                    async: false,
                    url: "/sysUser/addOrEdit",
                    //$(form).serialize(),输出序列化表单值的结果,该Api可用于AJAX 请求的data
                    data:JSON.stringify(object),
                    success: function (res) {
                        if (res.message == "ok") {
                            layer.msg("编辑成功，2秒后返回...", {time: 2000}, function () {
                                var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                                parent.layer.close(index);
                            });
                        }
                    }
                });
            }
        });
    });
</script>

<!--修改按钮值回显-->
<script th:inline="javascript">
    var sysUser = [[${sysUser}]];
    if (sysUser != null) {
            $("#id").val(sysUser.id);
            $("#username").val(sysUser.username);
            $("#realname").val(sysUser.realname);
            $("#password").val(sysUser.password);
            $("#salt").val(sysUser.salt);
            $("#avaotr").val(sysUser.avaotr);
            $("#birthday").val(sysUser.birthday);
            $("#sex").val(sysUser.sex);
            $("#email").val(sysUser.email);
            $("#phone").val(sysUser.phone);
            $("#address").val(sysUser.address);
            $("#status").val(sysUser.status);
            $("#delFlag").val(sysUser.delFlag);
    }
</script>

</body>

</html>
